-
-
Notifications
You must be signed in to change notification settings - Fork 2.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(solid-query): Add reconcile
option
#5287
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 1 Ignored Deployment
|
☁️ Nx Cloud ReportCI is running/has finished running commands for commit 43001f5. As they complete they will appear below. Click to see the status, the terminal output, and the build insights. 📂 See all runs for this branch ✅ Successfully ran 4 targets
Sent with 💌 from NxCloud. |
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 43001f5:
|
Codecov ReportPatch coverage:
📣 This organization is not using Codecov’s GitHub App Integration. We recommend you install it so Codecov can continue to function properly for your repositories. Learn more Additional details and impacted files@@ Coverage Diff @@
## alpha #5287 +/- ##
==========================================
- Coverage 90.07% 84.74% -5.34%
==========================================
Files 75 11 -64
Lines 2681 177 -2504
Branches 742 32 -710
==========================================
- Hits 2415 150 -2265
+ Misses 234 21 -213
+ Partials 32 6 -26
... and 65 files with indirect coverage changes Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here. ☔ View full report in Codecov by Sentry. |
Here is an example of it in action! https://stackblitz.com/github/ardeora/solid-query-reconcile?file=src%2FApp.tsx |
* release: v5.0.0-alpha.11 * refactor(core): unify hydration options (#5131) * refactor: unify hydration options * docs: update hydration docs * migration guide * refactor: use shouldDehydrate... syntax * Update docs/react/guides/migrating-to-v5.md Co-authored-by: Fredrik Höglund <fredrik.hoglund@gmail.com> * Apply suggestions from code review * chore: fix tests * chore: fix tests * Update docs/react/reference/hydration.md --------- Co-authored-by: Fredrik Höglund <fredrik.hoglund@gmail.com> * release: v5.0.0-alpha.12 * release: v5.0.0-alpha.13 * chore: remove unused devDependencies (#5211) * refactor(react-query-devtools): move devtools components in files (#5150) * refactor(react-query-devtools): move QueryStatusCount header to subdirectory * refactor(react-query-devtools): move QueryRow to subdirectory * refactor(react-query-devtools): move ActiveQuery to subdirectory * refactor(react-query-devtools): move Cache Panel to subdirectory * lint * refactor: add display names * fix: typo * release: v5.0.0-alpha.14 * fix(solid-query): SSR fixes - Inconsistent state (#5093) * fix(solid-query): do not call unsubscribe on the server * fix(solid-query): prefer val from queryResource if it is available there * chore: add hydration debugger to solid ssr example * bump minimum solid-js version * chore: pnpm i * chore: fix rollup babel typings Result of this change upstream that types the “targets” property -> https://github.com/DefinitelyTyped/DefinitelyTyped/pull/63927/files#diff-a4da813bfdc10bbb7d4d9ee9b811309e7e2a16c0484b9a334752db84be4b0f31 Signed-off-by: marbemac <marbemac@gmail.com> * replace void 0 Signed-off-by: marbemac <marbemac@gmail.com> * chore: remove uncessary onMount Signed-off-by: marbemac <marbemac@gmail.com> * chore: skip this onComputed on first render Signed-off-by: marbemac <marbemac@gmail.com> * fix: copy state properties over for ssr hydration Signed-off-by: marbemac <marbemac@gmail.com> --------- Signed-off-by: marbemac <marbemac@gmail.com> * release: v5.0.0-alpha.15 * fix(solid-query): Fix non hydrating queries (#5229) * release: v5.0.0-alpha.16 * release: v5.0.0-alpha.17 * docs(react): fix typo in TypeScript.md (#5239) Signed-off-by: Eng Zer Jun <engzerjun@gmail.com> * fix: do not mutate input (#5240) * fix: do not mutate input params passed to function from consumers should be treated as readonly and thus shouldn't be modified * test: remove unexpected `exact` props from find methods --------- Co-authored-by: Damian Osipiuk <osipiukd+git@gmail.com> * release: v5.0.0-alpha.18 * docs: update migrating-to-v5 (#5274) I think the rocket emoji is causing a visual bug too but since I edited this through GitHub's UI, I couldn't confirm. * fix(query-core): correct placeholderData prevData value with select fn (#5227) * fix(query-core): correct placeholderData prevData * fix(query-core): preserves correct prevQueryResult This commit preserves the correct previous result between rerenders. * test(react-query): Test with placeholder & select * fix(query-core): Add lastDefinedQueryData property * fix(query-core): Remove console.log * fix(query-core): Add react-query test * release: v5.0.0-alpha.19 * feat(solid-query): Add `reconcile` option (#5287) * feat(solid-query): Add `reconcile` option * feat(solid-query): Add `reconcile` callback test * release: v5.0.0-alpha.20 * chore: adapt tests to v5 syntax after merge * feat: remove callbacks from QueryObserver (#5282) * feat: remove callbacks from QueryObserver types are passing now * test: remove some more callback related tests * docs: migration guide for removed callbacks * chore: fix broken lock file * chore: remove unused variables those were only needed on main for keepPreviousData, which doesn't exist anymore * release: v5.0.0-alpha.21 * fix(solid-query): Remove unserializable values (#5326) * release: v5.0.0-alpha.22 * feat: rename throwErrors to throwOnError (#5318) * feat: rename throwErrors to throwOnError to be aligned with the options we already have on imperative methods, like `invalidateQueries` * docs: fix outdated code reference * chore: rename type * fix: let the refetchInterval function also return undefined and fall back to false if it does * release: v5.0.0-alpha.23 * docs: remove duplicated `isInitialLoading` (#5327) * fix: make sure codemods are included in react-query (#5340) * chore: fix pr pipeline (#5345) * chore: remove unneeded script * chore: fix syntax error after merging * Empty-Commit * chore: update to node18 to hopefully fix CI issues see: vitest-dev/vitest#1191 (comment) * chore: don't throw error if build dir already exists * release: v5.0.0-alpha.24 * feat: queryOptions helper function (#5153) * feat: queryOptions helper function so that we can define and share options outside of useQuery, but still get the type inference * docs: queryOptions * docs: remove reference to onError * docs: update migration guide * release: v5.0.0-alpha.25 * chore: remove createStore option (#5352) having the option to customize the internal store sound nice, but the problem is that the store holds Query instances, not data. So, the setter is only called once, not on every data update. This makes it relatively useless - every time we thought we could leverage createStore, it fell short of our requirements because of this. The better way is usually to subscribe to the QueryCache directly * docs: remove callbacks from useQuery * fix(core): make sure refetching multiple queries imperatively works offline (#5249) * fix(core): make sure refetching multiple queries imperatively works offline * test: add another test for different networkMode * fix: always catch promises even if we don't return them because we are offline * release: v5.0.0-alpha.26 * chore: svelte-query tests, validatePackages changes * feat(devtools): Add framework agnostic devtools (#5347) * feat(devtools): Add framework agnostic devtools draft * Fix test * Move query-devtools build before react-query-devtools * Fix dimensions bug & add isInitialOpen props * Fix isOpen state * Add devtools cutom errorTypes option * Add explicit close button * Add keyboard focus for tooltips * Add query-core to query-devtools peerDependencies * Update pnpm lock file * Add overflow hidden to hide filters on top view * Revert overflow hidden - causing other issues * Update documentation * Fix validate-packages script --------- Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * fix(query-devtools): Add query-core to devDependencies (#5360) * fix(query-devtools): Add query-core to devDependencies * Fix pnpm-lock.yaml * release: v5.0.0-alpha.27 * feat(solid-query): `queryOptions` helper for solid-query (#5355) * feat: queryOptions helper for solid-query * add tests * fix imports * release: v5.0.0-alpha.28 * feat(svelte-query-devtools): Svelte Adapter for new Devtools (#5362) * Implement working devtools component * Fix pnpm-lock.yaml * Update workspace config * Always a prettier error * Fix eslint error * Fix test:types * Add svelte-query to deps * Use esm-env to block loading in prod * Remove example changes * Simpler export * Allow dynamically editing props * Run prettier * fix(devtools): Update ESM export extension (#5364) * fix(devtools): Update ESM export extension * Update Svelte devtools types error * Fix svelte-query-devtools types error * release: v5.0.0-alpha.29 * feat(devtools): Make queryclient reactive (#5366) * release: v5.0.0-alpha.30 * Revert changes to svelte-query build * fix(svelte-query-devtools): Fix tsconfig paths * fix(svelte-query-devtools): Fix issue parsing JSX (#5372) * feat(query-core): Add previousQuery to placeholderFn (#5358) * feat(query-core): Add previousQuery to placeholderFn * Add query-core and react-query tests * Remove unused query type --------- Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * release: v5.0.0-alpha.31 * docs: Update dependent-queries.md (#5391) I believe `isLoading` has been renamed to `isPending` * refactor: unwrap listeners * chore: relax eslint for tests * release: v5.0.0-alpha.32 * docs: new docs for placeholderData * feat(useQueries): combine (#5219) * attempt at adding combine on observer level (doesn't work) * feat(useQueries): combine adapt getOptimisticResult to return both the result array and a combined result getter * feat(useQueries): combine make sure combinedResult stays in sync with result * feat(vue-query): combine results for useQueries hook * Add new options to svelte-query * Add new options to solid-query * fix: enable property tracking for useQueries * fix: move property tracking to react layer * chore: remove logging * chore: remove unnecessary type assertion * test: tests for combined data * docs: combine --------- Co-authored-by: Damian Osipiuk <osipiukd+git@gmail.com> Co-authored-by: Lachlan Collins <1667261+lachlancollins@users.noreply.github.com> Co-authored-by: Aryan Deora <adeora@iu.edu> * docs: combine * chore: setup fallback base to origin/main if we trigger a release manually via github, this value might not be filled * release: v5.0.0-alpha.34 * docs: update installation * chore: Improve eslint/tsconfig setup in svelte packages (#5438) * fix(types): fix TError generic on queryOptions * release: v5.0.0-alpha.35 * release: v5.0.0-alpha.36 * chore: Bump eslint version to 8.34.0 (#5439) * feat(svelte-query): Simplify types (#5442) * release: v5.0.0-alpha.37 * chore: Update dev dependencies (#5466) * chore: Replace cp with cpy-cli (#5441) Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * fix: Update typescript-eslint (#5467) * release: v5.0.0-alpha.38 * chore: More package updates (#5468) * chore: Link examples to workspace packages (#5469) * feat(svelte-query): Switch to moduleResolution bundler (#5471) * fix: Downgrade chalk to v4 (#5472) * release: v5.0.0-alpha.39 * docs: change Hydrate->HydrationBoundary (#5455) * updated docs on SSR Hydrate -> HydrationBoundary * docs(ssr): change Hydrate->HydrationBoundary change Hydrate->HydrationBoundary to remove deprecated component * docs(ssr): rename all Hydrate->HydrationBoundary rename all Hydrate instances ->HydrationBoundary for consistency * feat(react-query-persist-client): await onuccess (#5473) * fix: have `onSuccess` return a promise too so that we can await it that way, invalidation or mutations that run in onSuccess will still keep isRestoring to be false, which avoids race conditions * test: test for awaiting onSuccess * docs: onSuccess * release: v5.0.0-alpha.40 * release: v5.0.0-alpha.41 * chore: Regenerate alpha lockfile (#5477) * docs(solid-query): Fix API signature in overview.md (#5470) * docs(svelte-query): Add svelte-query-devtools to examples (#5478) * chore: Clean-up eslint config (#5481) * chore: More eslint improvements (#5482) * feat: Convert rollup config to ESM (#5484) * chore: Migrate scripts to ESM (#5486) * feat: Split rollup config for Nx caching (#5487) * fix: Fix CJS/ESM issue with @commitlint/parse I can't believe these issues still exist, see evanw/esbuild#1719 * chore: Update prettier, eslint, rollup, scripts (#5490) * chore: Fix prettierignore * release: v5.0.0-alpha.42 * fix: Update @commitlint/parse (#5491) See conventional-changelog/commitlint#3614 * release: v5.0.0-alpha.43 * chore: Add eslint-plugin-compat (#5495) * Fix workspace links * Add eslint-plugin-compat * Update nx.json * fix: Improve workspace tsconfig (#5497) * release: v5.0.0-alpha.44 * fix: Move deps/devDeps/peerDeps to appropriate location (#5498) * chore: Extend base tsconfig for svelte packages (#5501) * release: v5.0.0-alpha.45 * chore: Make test:types have no Nx output (#5500) * feat: Remove svelte field from package.json (#5504) * release: v5.0.0-alpha.46 * feat: Add explicit package.json `type` field (#5505) * release: v5.0.0-alpha.47 * chore: Fix nx affected (#5509) * fix: Fix ESLint warnings (#5510) * release: v5.0.0-alpha.48 * chore: Update to Nx 16.3.1 (#5514) * chore: Update to nx 16.3.1 * Update pnpm-lock.yaml * chore: Update Nx cloud workflow (#5515) * feat: Drop legacy webpack v4 support (#5507) * release: v5.0.0-alpha.49 * feat: Remove UMD build output (#5517) * release: v5.0.0-alpha.50 * chore: Rework rollup externals (#5519) * feat: Refactor package exports (#5520) * chore: Remove publint error temporarily * release: v5.0.0-alpha.51 * fix: Publint error in solid-query (#5522) * release: v5.0.0-alpha.52 * fix: Simplify exports in solidjs packages (#5523) * release: v5.0.0-alpha.53 * chore: Improve Nx task separation (#5524) * Fix ci workflow nx run-many doesn't use --base * feat(query-devtools): Lazyload Query Devtools Core (#5527) * release: v5.0.0-alpha.54 * fix(query-devtools): Broken package.json exports (#5528) * Make publint throw errors * Rewrite CJS files to use .cjs extension * Add concurrency option to PR workflow * Fix export extensions * release: v5.0.0-alpha.55 * chore: Re-enable Nx Distributed Task Execution (#5518) * fix(query-devtools): inform onlineManager when offline mode is simulated (#5534) * release: v5.0.0-alpha.56 * docs: make returning a promise for optimistic updates more explicit (#5485) * fix(codemod): do not mark the `buildMessage` method as private (#5546) * fix(codemod): do not mark the `buildMessage` method as private It might fail because of the lack of support. * chore(codemod): add missing `filePath` parameter to the docblock * release: v5.0.0-alpha.57 * fix(query-devtools): Fix getSidedProp bug (#5551) * release: v5.0.0-alpha.58 * chore: Update publish script (#5559) * fix(query-devtools): Add chunkFileNames option (#5560) * release: v5.0.0-alpha.59 * fix: Change `svelte-package` output directory (#5561) * release: v5.0.0-alpha.60 * release: v5.0.0-alpha.61 * chore: try to stabilize test * fix(solid-query): Use rollup-preset-solid (#5565) * release: v5.0.0-alpha.62 * feat: Add legacy rollup builds (#5570) * release: v5.0.0-alpha.63 * docs: Add `"private": true` to examples (#5578) * release: v5.0.0-alpha.64 * fix(useIsMutating): fix vue warning (#5453) onScopeDispose() is called when there is no active effect scope to be associated with * release: v5.0.0-alpha.65 * feat(infiniteQuery): allow prefetching arbitrary amounts of pages (#5440) * refactor: combine fetching first page with refetching as it's the same condition * feat(infiniteQuery): allow prefetching arbitrary amounts of pages * test prefetching * fix: make sure that pages and getNextPageParam are passed in tandem to (pre)fetchInfiniteQuery * docs: prefetching * chore: try to stabilize test * docs: migration guide * release: v5.0.0-alpha.66 * refactor: move queryOptions to its own file (#5480) * refactor: remove 'use client' from non-components * refactor: move queryOptions to its own file where we don't have a 'use client' directive, because we can call this function on the server as well * Revert "refactor: remove 'use client' from non-components" This reverts commit 8ecac66. * refactor: rename isRestoring file * chore: fix import * release: v5.0.0-alpha.67 * fix: Update eslint-plugin-query build config (#5601) * fix: Use pnpm workspace protocol (#5600) * release: v5.0.0-alpha.68 * chore: Use nx watch command (#5605) * fix(solid-query): revert package.json typo (#5615) * release: v5.0.0-alpha.69 * release: v5.0.0-alpha.70 * release: v5.0.0-alpha.71 * chore: Fix Nx parallelisation for vue-query tests (#5635) Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * fix(devtools): padding for action buttons (#5608) global `button` styles would otherwise affect buttons * release: v5.0.0-alpha.72 * feat: Support Svelte v4 (#5659) * feat: Support svelte v4 * Downgrade @testing-library/svelte * Upgrade @testing-library/svelte to 4.0.3 * Refactor onMount dynamic import * release: v5.0.0-alpha.73 * fix(eslint-plugin-query): Use tsup to generate types (#5666) * release: v5.0.0-alpha.74 * fix: Skip queryClient context lookup if client passed directly (#5669) * release: v5.0.0-alpha.75 * feat: Accept all svelte stores as options (#5672) * refactor: Accept stores other than writable * Cleanup Readable type import * Add tests * Stricter isSvelteStore check * Update docs * Fix input bind * Add testing-library cleanup * release: v5.0.0-alpha.76 * fix(svelte-query): Fix staleTime reactivity bug (#5682) * release: v5.0.0-alpha.77 * chore(svelte-query): Update reactivity docs and tests (#5683) * fix(query-devtools): Bundle all dependencies (#5684) * release: v5.0.0-alpha.78 * release: v5.0.0-alpha.79 * feat: react-query-next-experimental package (#5598) * chore: fix a copy-paste error * chore: bootstrap package * chore: setup package * chore: allow passing with no tests * fix: remove 'use client' from index bundle * chore: cleanup copy/paste error * chore: fix prettier * refactor: replace ref with direct props access * fix: do not write to refs during render * refactor: inline function into useEffect to avoid useCallback * fix: eslint no-shadow * refactor: namespace id * refactor: removed pointless check * fix: set to empty array on cleanup * fix: adapt for v5 changes * chore: fix build * docs: add streaming example * chore: fix outdated lockfile * chore: fix prettier * refactor: remove isSubscribed ref * refactor: re-arrange comment * chore: remove comments * chore: fix broken lock file * feat: allow customization of hydrate / dehydrate options and make sure we fall back to the defaultShouldDehydrate function, which only dehydrates successful queries * release: v5.0.0-alpha.80 * docs: fix nextjs-streaming example * fix(core) : sync Observer 'current' properties when optimistic reading occurs (#5611) * fix-5538 : sync Observer 'current' properties when optimistic reading occurs * Flip test on currentResult with placeholderData's order & add test * Fix tests using the same queryKey * remove options.placeHolderData from deciding whether to assign observer current properties, use equalitycheck on v5 * maybe fix for vue reactivity cbs * test(vue-query): test persister with useQuery * Force line terminator to \\n on codemods tests * Revert " Force line terminator to \\n on codemods tests" This reverts commit 6f0a469. --------- Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> Co-authored-by: Damian Osipiuk <osipiukd+git@gmail.com> * chore: Force line terminator to \\n on codemods tests (#5664) Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * chore: stabilize a flaky test * release: v5.0.0-alpha.81 * docs: remove devtools from example because they currently don't work * fix(query-devtools): Force publish package (#5715) * release: v5.0.0-alpha.82 * docs: re-enable devtools * fix: Update dev dependencies (#5718) * release: v5.0.0-alpha.83 * chore: Add vite to root package.json (#5722) * refactor: Add new eslint sorting from main (#5723) * release: v5.0.0-alpha.84 * chore: Update vite and vitest (#5724) * chore: Remove eslint-plugin-compat (#5732) * feat: include meta in query and mutation hydration (#5733) * feat: include `meta` in query and mutation hydration * test: tests for meta hydration * chore: stabilize a flaky test * chore: stabilize another flaky test * release: v5.0.0-alpha.85 * fix(onlineManager): always initialize with `online: true` (#5714) * fix(onlineManager): always initialize with `online: true` instead of relying on navigator.onLine, because that indicator is broken AF in chrome https://bugs.chromium.org/p/chromium/issues/list?q=navigator.online * docs: document subscribe methods * docs * test: fix types in tests setting to undefined is now illegal, so we have to reset to `true`, which is the default now * fix(tests): switch from mocking navigator.onLine to mocking onlineManager.isOnline * fix: offline toggle in devtools it should now be enough to set online to true / false, without firing the event, because we always set & respect that value. we don't override the event handler, so real online / offline events might interfere here * chore: fix tests with the implementation of onlineManager, where we default to `true`, we need an explicit `'offline'` event to get it to false; otherwise, switching back to true doesn't change the state, so subscribers are not informed * chore: prettier write * chore: fix eslint * chore: delete an old, flaky test that doesn't test much * release: v5.0.0-alpha.86 * docs: use bundlejs for bundle-size * docs: fix link * feat: Replace rollup with tsup/esbuild (#5597) Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> Co-authored-by: Aryan Deora <adeora@iu.edu> * release: v5.0.0-alpha.87 * chore: Simplify tsconfig (#5745) * fix: Simplify devDependencies (#5747) * fix: Fix tsconfig "include" setting (#5750) * release: v5.0.0-alpha.88 * docs: fix potential typo (#5748) * fix potential typo * Update docs/react/guides/queries.md --------- Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * fix: Add missing extensions to ESM imports (#5751) * chore: Bundler integration tests (#5756) * Add react-cra5 test * Add react-cra4 test * Add react-vite test * Add svelte-vite test * Add solid-vite test * Run prettier * Rename script to test:bundle * Add vue-vite test * Run prettier * fix(query-devtools): Fix Devtools Build Issues (#5768) * release: v5.0.0-alpha.89 * feat(codemod): add codemod that renames the `Hydrate` component usages to `HydrationBoundary` usages (#5761) * feat(codemod): add codemod that renames the `cacheTime` and `useErrorBoundary` object properties and TypeScript property signatures (#5765) * feat(react-query): useSuspenseQuery (#5739) * feat: useSuspenseQuery * feat: infiniteQueryOptions * fix: add exports * feat: useSuspenseInfiniteQuery * feat: initialData overloads for useInfiniteQuery * fix: types * chore: stabilize test we sometimes get failureCount: 2, but it doesn't matter here (timing issue) * fix: types for useSuspenseQuery (#5755) * docs: suspense * docs: api reference * docs: useSuspenseQuery in examples * fix: types for useSuspenseInfiniteQuery (#5766) --------- Co-authored-by: Jonghyeon Ko <manudeli.ko@gmail.com> * release: v5.0.0-alpha.90 * chore: fix prettier * chore: fix tests * release: v5.0.0-alpha.91 --------- Signed-off-by: marbemac <marbemac@gmail.com> Signed-off-by: Eng Zer Jun <engzerjun@gmail.com> Co-authored-by: Tanner Linsley <tannerlinsley@users.noreply.github.com> Co-authored-by: Fredrik Höglund <fredrik.hoglund@gmail.com> Co-authored-by: Gabriel Pichot <gabriel.pichot@gmail.com> Co-authored-by: Marc MacLeod <marbemac@gmail.com> Co-authored-by: Aryan Deora <adeora@iu.edu> Co-authored-by: Eng Zer Jun <engzerjun@gmail.com> Co-authored-by: Damian Osipiuk <osipiukd+git@gmail.com> Co-authored-by: Arthur Denner <arthurdenner7@gmail.com> Co-authored-by: Ilya <marchukilya@gmail.com> Co-authored-by: Lachlan Collins <1667261+lachlancollins@users.noreply.github.com> Co-authored-by: OrJDev <91349014+OrJDev@users.noreply.github.com> Co-authored-by: Enguerrand des Vaux <enguerrand@des-vaux.fr> Co-authored-by: Dennis kinuthia <denniskinuthiaw@gmail.com> Co-authored-by: Yuji Sugiura <leader22@users.noreply.github.com> Co-authored-by: Yaroslav Lapin <jlarky@gmail.com> Co-authored-by: Balázs Máté Petró <petrobalazsmate@gmail.com> Co-authored-by: Aleksandr Semenov <juvirez@gmail.com> Co-authored-by: Matthew Salsamendi <matthewsalsamendi@gmail.com> Co-authored-by: Speros Kokenes <skokenes@users.noreply.github.com> Co-authored-by: EL AYADI Mohamed <moh.el.ayadi@gmail.com> Co-authored-by: Dale Seo <5466341+DaleSeo@users.noreply.github.com> Co-authored-by: Jonghyeon Ko <manudeli.ko@gmail.com>
This pull request proposes a new feature for
solid-query
that allows for more precise updates to query data. The newreconcile
option enables updates to be made between state updates, while the structuralSharing option is removed since it doesn't work well withsolid-js'
data diffing patterns.Visualisation
Before
Consider this following example that fetches data for a users list with createQuery.
Currently, every time a user clicks the
Refetch
button, thequeryFn
is re-run, and a new array reference of the updated users list is returned. As a result, new DOM nodes are created every time the query data updates, which can quickly become expensive.With the proposed feature, whenever the query data updates, the previous data will be transformed into the shape of the new data while preserving referential equality of the data array between updates. This will allow for fine-grained updates to the already created DOM nodes.
After
The diagram illustrates how the reconcile option can enable fine-grained updates. Whenever the
queryFn
is re-run, theid
reconcile key can help solid-query identify which objects in the array have been updated, allowing for precise updates to those objects while preserving their referential equality.This feature can be compared to the
key
prop used in React, which allows for efficient updates of lists by identifying unique keys for each element. Thereconcile
option in solid-query works similarly but operates at a more granular level, allowing for precise updates to individual elements within an array.Overall, this feature can significantly improve the efficiency of applications and reduce the cost of updates by enabling precise and efficient updates to query data.
API reference
The
reconcile
option in solid-query can be used in multiple ways.Option 1:
reconcile
keySimilar to the example above. The
reconcile
option can take anystring
value that will act as a key for the data returned bycreateQuery
. In the example above, the reconcile option is set toname
, which means thatsolid-query
will use thename
property of each fruit object to reconcile updates to the query data.Option 2:
reconcile
functionAnother way to use the
reconcile
option in solid-query is by providing a callback function that receives both the previous data and the new data returned by createQuery. This function allows users to provide their own reconciliation logic based on the data being updated.In the code snippet above, the
reconcile
function takes two arguments: oldData and newData. If there is nooldData
, the function returns thenewData
as is. If there isoldData
, the function uses theproduce
function from thesolid-js/store
library to create a mutable copy of the old data. It then iterates over each fruit object in the old data, checks if there is a matching fruit object in the new data based on the name property, and updates the emoji property of the old object if a match is found.Option 3: disable
reconcile
logicIf users don't want to perform fine-grained updates to the data, they can disable the
reconcile
option by setting it tofalse
. This will bypass any reconciliation logic and perform immutable updates between query updates.I believe this change makes
solid-query
even more powerful and intuitive by allowing users to optimize the performance of their applications while providing a smooth user experience.As always, we encourage everyone to test out this new feature and provide feedback and concerns in the comments. Thank you for your contributions!